import React from 'react'
import Component, { mapStateToProps, mapDispatchToProps } from '@components/Component'
import { connect } from 'react-redux'
import style from './Statistic.module.less'
import NumberStatistic from '@components/MonthStatistic/NumberStatistic'
import MoneyStatistic from '@components/MonthStatistic/MoneyStatistic'
import { Select } from 'antd'

class MonthStatistic extends Component {
  state = {
    options: [],
    code: ''
  }

  initList () {
    this.$get('/api/mgt/institutionstat', {
      condition: JSON.stringify([{ k: 'pid', o: 'null' }])
    }).then((res) => {
      if (res.status === 1) {
        this.setState({ options: res.data.map(li => ({ label: li.name, value: li.tenant_code })) })
      }
    })
  }

  componentDidMount () {
    this.initList()
  }

  render () {
    return (
      <div className={style.container} style={{ paddingTop: '24px' }}>
        <div className={style['institution-line']}>
          <Select className={style.institution} options={this.state.options} placeholder='请选择仲裁机构' allowClear onChange={e => this.setState({ code: e })} />
        </div>
        <div className={style.block}>
          <NumberStatistic code={this.state.code} />
        </div>
        <div className={style.block}>
          <MoneyStatistic code={this.state.code} />
        </div>
      </div>
    )
  }
}

const mapState = mapStateToProps(function (state) {
  return {
    userInfo: state.basic.userInfo
  }
})

const mapDispatch = mapDispatchToProps(function (dispatch) {
  return {
  }
})

export default connect(mapState, mapDispatch)(MonthStatistic)
